Flyapp - Full Responsive Landing Page Template Documentation

A Complete Guide of Flyapp - Full Responsive Landing Page Template - Document Version 1.1

Support Item Page Live Demo

General Informations - top

First of all, we want to say thanks you! We are very grateful that you have chosen our Creativ one page site for your langding page website. We will do everything we can to provide you the best support possible. Feel free asking us if you need more help.

This document covers the Flyapp - Full Responsive Landing Page structure, set up, and use of this template and provides answers and solutions to common problems and issues - we encourage you to read this document thoroughly if you experience any difficulties. If you have any questions that are beyond the scope of this document, feel free to ask support. (Support)


Folder Structure - top

How To? - top

How to Customize Main Header?
		 <!-- START HEARDER SECTION -->
    <header id="home" class="header">
        <div class="container">
        <div class="row">
            <div class="col-md-6 col-sm-6">
                <div class="header-text">
                    <h1<FLYAPP is a <span>Proffessional</span> App!</h1>
                    <p><strong>With Multi Purpose Features</strong></p>
                   <p<FLYAPP dolor sit amet, eum dissentias philosophia an. No melius virtute 
                   vis, vix dolor dolore efficianturex cum atomorum definitiones, his in natum</p>  
                    <a href="#" class="ank">READ MORE</a>	 
                      <a href="#" class="ank">DOWNLOAD NOW</a> 
              </div>	      
        </div>
             <div class="col-md-6 col-sm-6">	 
                <div class="header-img">	 
                     <img src="assets/img/mobile.png" alt="mobile">	 
                 </div>	  
              </div>	  
         </div>	      
        </div>
      </header>
 
   

			


HTML Structure - top

The template is build on Bootstrap 3.3.7 the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web..

Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.

Create a .container (fixed-width) or .container-fluid (full-width) for proper alignment and padding, then create .row and add columns with appropriate device name (xs, sm, md, lg) and grid number (2, 4, 6, 12).

For full documentation, please visit Bootstrap 3 site: http://getbootstrap.com/css/

  • css/bootstrap.min.css
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">

</head>

<div class="container">
	<div class="row">
		<div class="col-lg-6">
			...
		</div>
		
		<div class="col-lg-6">
			...
		</div>
	</div>
</div>

CSS Structure - top

CSS folder and files struture Well organized.
These are the CSS file you're be using in the template:

  • css
bootstrap.min.css (Bootstrap Original file of 3.3.7 Don't touch this file)
style.css (All custom elements in this file)
	

Java Script - top

jQuery - is a Javascript library that greatly reduces the amount of code that you must write. For more information, please visit http://www.jquery.com/

The initialization of the elements, libs and features is made by the file scripts.js, in the js folder. Take a look at the "build" function to see what it does.

  • js/jquery.js
<!-- Custom Functions -->
<script src="assets/js/custom.js" typr="text/javascript"></script>
	


Font Awesome Icon - top

In Flyapp- Full Responsive Landing Page Template we used FontAwesome icons. Which is more user friendly and 350+ icons avaiable.

You can find all icon classes here : FontAwesome.

Use of icons :

<i class="fa fa-trophy"><i>		
<i class="fa fa-code"><i>
<i class="fa fa-globe"><i>
<i class="fa fa-rocket"><i>
<i class="fa fa-diamond"><i>
<i class="fa fa-database"><i>
<i class="fa fa-crop"><i>
<i class="fa fa-html5"><i>
<i class="fa fa-explorer"><i>
<i class="fa fa-link"><i>
<i class="fa fa-phone"><i>
<i class="fa fa-clock-o"><i>
<i class="fa-facebook"><i>	
<i class="fa fa-twitter"><i>	
<i class="fa fa-google-plus"><i>	
<i class="fa fa-pinterest"><i>	
<i class="fa fa-envelope"><i>	
<i class="fa fa-linkedin"><i>	

Sources and Credits - top
I've used the following plugins as listed.

Images:

Free fonts:


All images have been used for demonstration purposes only and are not included in the template.


Once again, thank you so much for purchasing this template. As I said at the beginning, I'd be glad to help you if you have any questions relating this template. No guarantees, but I'll do my best to assist. If you have any suggestions on how to improve our templates or documentation please share them!